<template>
	<view class="wrap">
		<view class="article-title">{{form.noticeTitle}}</view>
		<view class="article-meta">
			<span>{{form.createBy}}</span> <span
				style="font-size: 26rpx;color: #999999;padding-left: 10px;">{{form.createTime}}</span></text>
							<!-- <button v-if="this.$store.getters.userId!=1" class="mini-btn" type="primary" size="mini" @click="btnClick">{{btnName}}</button> -->
		</view>
		<view class="article-content">
			<rich-text :nodes="form.noticeContent" class="ql-editor"></rich-text>
			<!-- <u-parse :content="form.noticeContent"></u-parse> -->
		</view>
	</view>
</template>

<script>
	import {
		getNoticeById,
		updateStateNotice
	} from '@/api/system/user.js';
	import store from '@/store/index.js';
	import {
		baseUrl
	} from '../../../config';
	export default {
		data() {
			return {
				btnName:"未读",
				form: {
					noticeId: undefined,
					createBy: undefined,
					noticeTitle: undefined,
					createTime: undefined,
					noticeContent: undefined
				},
			};
		},
		onLoad() {
			this.getList();
			this.getStateNotice();
		},
		methods: {
			btnClick(){
				this.btnName='已读';
			},
			getList() {
				this.form = store.state.CusImform;
				this.form.noticeContent = store.state.CusImform.noticeContent.replace(/src="\/(prod|dev)-api/g, 'src="' +
					baseUrl);
			},
			getStateNotice() { 
				if(this.$store.getters.userId!=1){
					if ((this.$store.getters.userId && this.form.noticeId != null)&&this.form.sysUserNotice.isRead==0 ) {
						updateStateNotice(this.$store.getters.userId, this.form.noticeId).then(res => {
					
						})
					}
				}

			},
		},
	}
</script>
<style lang="scss">
	page {
		background-color: #ffffff;
	}

	.article-title {
		font-size: 40rpx;
		font-weight: 400;
		text-align: left;
		padding-bottom: 10rpx;
		font-weight: bold;
		margin: 30rpx 30rpx 0;
		color: #333333;
	}

	.article-meta {
		padding: 10rpx 30rpx 30rpx;
		color: #999999;
		border-bottom: 1px solid #ededed;
	}

	.article-content {
		padding: 30rpx 30rpx 0rpx;
		overflow: hidden;
		font-size: 30rpx;
		line-height: 50rpx;

		/deep/ p {
			margin-bottom: 20rpx;
			text-indent: 60rpx;
		}

		.banner-pic {
			margin: 10px auto;
			text-align: center;

			uni-image {
				width: 300px;
				height: 160px;
				box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);

			}
		}
	}

	.article-foot {
		padding: 0 30rpx 20rpx;
		font-size: 26rpx;
		color: #999999;

		.u-icon {
			margin-right: 10px;
		}
	}
</style>